import React from "react";
import "./index.css"

const horizonUrl = "https://g.alicdn.com/aliyun-gts-solution/msha-frontend/0.0.22/blueLine_753e8714.gif"
const arrowUrl = "https://g.alicdn.com/aliyun-gts-solution/msha-frontend/0.0.22/blueArrow_6184dabc.gif"

const Arrow = (props) => {
  const { direction, style, rate, info } = props
  return (
    <div className="arrow-box" style={style}>
      <div className={direction == "left" ? "custom-div" : "custom-div-right"} >
        <img src={horizonUrl} />
        <img src={arrowUrl} />
      </div>
      <span class="rate">{rate}</span>
      <span class="info">{info}</span>
    </div>
    
  )

}

export default Arrow